<template>
	<sw-common-frame :count="dataCount" :loading="loading">
		<template slot="button" v-if="isExistButton">
			<el-button size="small" type="primary" icon="el-icon-refresh" v-hasPermi="addedButton" @click="handleOpenDialog()">一键备份</el-button>
		</template>
		<el-form slot="query" size="small" inline v-if="isExistQuery">
			<el-form-item><el-input v-model="queryData.name" clearable placeholder="请输入备份名称"></el-input></el-form-item>
			<el-form-item><el-input v-model="queryData.createName" clearable placeholder="请输入创建人"></el-input></el-form-item>
			<!-- <el-form-item><el-input v-model="queryData.name" clearable placeholder="请输入IP地址"></el-input></el-form-item> -->
			<el-form-item><el-button type="primary" icon="el-icon-search" @click="handleQueryTableData()">查询</el-button></el-form-item>
		</el-form>
		<el-table slot="table" v-bind="tableConfig" :data="tableData">
			<el-table-column label="序号" type="index" align="center" width="50" />
			<el-table-column label="备份名称" prop="name" min-width="160"></el-table-column>
			<el-table-column label="IP地址" prop="ipAddr" min-width="100"></el-table-column>
			<el-table-column label="备份描述" prop="content" min-width="200"></el-table-column>
			<el-table-column label="创建人" prop="createName" width="120"></el-table-column>
			<el-table-column label="创建时间" prop="createTime" width="170"></el-table-column>
			<el-table-column label="操作" fixed="right" :width="handleWidth" v-if="isHasAuthButton">
				<template slot-scope="{ row }">
					<el-button type="text" v-hasPermi="handleButtons.record" @click="handleLookRecover(row)">恢复记录</el-button>
					<el-button type="text" v-hasPermi="handleButtons.recover" @click="handleRecoverData(row)">恢复</el-button>
					<el-button type="text" v-hasPermi="handleButtons.update" @click="handleOpenDialog(row.id)">修改</el-button>
				</template>
			</el-table-column>
		</el-table>
		<sw-pagination slot="page" :total="dataCount" :page.sync="queryData.page" :limit.sync="queryData.limit" @change="queryTableData" />
		<form-dialog v-model="formDialog" :data-id="dataId" @refresh="queryTableData()"></form-dialog>
		<recover-drawer v-model="recoverDrawer" :data-id="dataId"></recover-drawer>
	</sw-common-frame>
</template>

<script>
import formDialog from './form';
import recoverDrawer from './drawer';
import listMixins from '@/mixins/listMixins';
import { getBackupList, recoverDatabase, downDatabase } from '@/api/system/tbSysBackup';
export default {
	name: 'backupPage',
	mixins: [listMixins],
	components: { formDialog, recoverDrawer },
	data() {
		return {
			pageName: '备份',
			recoverDrawer: false
		};
	},
	computed: {
		listFunction() {
			return eval(getBackupList);
		},
		frameTopButton() {
			let frameTopBtns = [];
			if (!!this.addedButton) {
				frameTopBtns = [...frameTopBtns, this.addedButton];
			}
			return frameTopBtns;
		}
	},
	methods: {
		//恢复备份数据
		handleRecoverData(data) {
			this.$confirm(`确认恢复<font color="#f00">【${data.name}】</font>？恢复前请备份最新数据，以免丢失！`, '恢复提示', {
				type: 'warning',
				cancelButtonText: '去备份',
				confirmButtonText: '恢复备份',
				dangerouslyUseHTMLString: true,
				distinguishCancelAndClose: true,
				beforeClose: async (action, instance, done) => {
					if (action === 'confirm') {
						this.recoverBackupRequest(data.id);
					} else if (action === 'cancel') {
						this.dataId = '';
						this.formDialog = true;
					}
					done();
				}
			}).catch(() => {});
		},

		//查看恢复列表
		handleLookRecover(data) {
			this.dataId = data.id;
			this.recoverDrawer = true;
		},

		//恢复备份请求
		async recoverBackupRequest(id) {
			let fullLoading = this.$loading({ lock: true, text: '恢复备份数据进行中...', spinner: 'el-icon-loading', background: 'rgba(0, 0, 0, 0.7)' });
			let result = await recoverDatabase(id).then((res) => res.data);
			fullLoading.close();
			if (result.code === '0') {
				this.$showCustomMessage('success', '恢复备份成功');
			}
		},

		//下载备份
		async handleDownloadData(id) {
			let result = await downDatabase(id).then((res) => res.data);
		}
	}
};
</script>

<style scoped></style>
